import React from 'react';
import { View, Text, StyleSheet, Image,ImageBackground,ScrollView} from 'react-native';
import { deviceWidth } from 'src/util'
import Modal from 'react-native-modal'
import { deviceHeight, titleHeight } from '../../../../util';
import { Flex } from '@ant-design/react-native';


export default class SupportBankCardList extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            isVisible: false,
        }
    }
    showOrDismiss = (flag) => {
        this.setState({ isVisible: flag });
    }

    componentDidMount = () => {
        this.state.isVisible = this.props.isVisible;
    }



    render() {
        const {bankList} = this.props
        return (
            <Modal isVisible={this.state.isVisible}
            animationInTiming={500}
            animationOutTiming={100}
            animationIn="zoomInUp"
            animationOut={'zoomOutDown'}
                backdropOpacity={0.2}
                style={{
                    justifyContent:'center',
                    alignItems: 'center',
                }}
                onBackdropPress={() => {
                    this.showOrDismiss(false);
                }}>
                <ScrollView style={{marginBottom:titleHeight*3,height:200,width:deviceWidth*0.8,backgroundColor: '#fff',marginTop:titleHeight*3, borderRadius: 10 }}>
                {bankList.map((item, index) => {
                    return (
                    <View style={{paddingBottom:10,justifyContent:'center',alignItems:'center',borderBottomColor:'#E6E3E6',borderBottomWidth:1,}}>
                    <Text style={{marginTop:10,fontSize:14,color:'#000000',fontWeight:'bold'}} key={index}> {item.name}</Text>
                    </View>
                    )
                })}
                </ScrollView>

            </Modal>

        )
    }
}

const styles = StyleSheet.create({
    image: {
        width: 40,
        height: 40,
        marginLeft: 20
    },
    TextPosition: {
        marginTop: 10,
        marginLeft: 15,
        fontSize: 15
    },
    cellView: {
        height: 80,
        width: deviceWidth,
        paddingLeft: 20,
        paddingRight: 30
    }

})